<!DOCTYPE html>
<html>
<head><meta name="generator" content="Hexo 3.8.0">
  <meta charset="utf-8">
  
  <title>cookies | ryansecreat blog</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <meta name="description" content=":smile: 发版 发布阶段：更新chagelog ,打 git tag 。  word deflate 放气，紧缩 Sanitize 消毒，净化 js 随机字符串 Math.random().toString(36).substr(2));  Babel pollyfy 的作用 ：https://zhuanlan.zhihu.com/p/29058936  Babel stag2 的功能  h">
<meta name="keywords" content="零碎">
<meta property="og:type" content="article">
<meta property="og:title" content="cookies">
<meta property="og:url" content="http://yoursite.com/2019/06/24/cookies/index.html">
<meta property="og:site_name" content="ryansecreat blog">
<meta property="og:description" content=":smile: 发版 发布阶段：更新chagelog ,打 git tag 。  word deflate 放气，紧缩 Sanitize 消毒，净化 js 随机字符串 Math.random().toString(36).substr(2));  Babel pollyfy 的作用 ：https://zhuanlan.zhihu.com/p/29058936  Babel stag2 的功能  h">
<meta property="og:locale" content="zh-Hans">
<meta property="og:updated_time" content="2019-11-26T03:03:07.376Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="cookies">
<meta name="twitter:description" content=":smile: 发版 发布阶段：更新chagelog ,打 git tag 。  word deflate 放气，紧缩 Sanitize 消毒，净化 js 随机字符串 Math.random().toString(36).substr(2));  Babel pollyfy 的作用 ：https://zhuanlan.zhihu.com/p/29058936  Babel stag2 的功能  h">
  
    <link rel="alternate" href="/atom.xml" title="ryansecreat blog" type="application/atom+xml">
  
  
    <link rel="icon" href="/favicon.png">
  
  

  
  <link rel="stylesheet" href="/css/style.css">
  

</head>
</html>
<body>
  <div id="container">
    <div id="wrap">
      <header id="header">
  <div id="banner"></div>
  <div id="header-outer" class="outer">
    <div id="header-title" class="inner">
      <h1 id="logo-wrap">
        <a href="/" id="logo">ryansecreat blog</a>
      </h1>
      
        <h2 id="subtitle-wrap">
          <a href="/" id="subtitle">smile hard</a>
        </h2>
      
    </div>
    <div id="header-inner" class="inner">
      <nav id="main-nav">
        <a id="main-nav-toggle" class="nav-icon"></a>
        
          <a class="main-nav-link" href="/">Home</a>
        
          <a class="main-nav-link" href="/archives">Archives</a>
        
      </nav>
      <nav id="sub-nav">
        
          <a id="nav-rss-link" class="nav-icon" href="/atom.xml" title="RSS Feed"></a>
        
        <a id="nav-search-btn" class="nav-icon" title="Search"></a>
      </nav>
      <div id="search-form-wrap">
        <form action="//google.com/search" method="get" accept-charset="UTF-8" class="search-form"><input type="search" name="q" class="search-form-input" placeholder="Search"><button type="submit" class="search-form-submit">&#xF002;</button><input type="hidden" name="sitesearch" value="http://yoursite.com"></form>
      </div>
    </div>
  </div>
</header>
      <div class="outer">
        <section id="main"><article id="post-cookies" class="article article-type-post" itemscope="" itemprop="blogPost">
  <div class="article-meta">
    <a href="/2019/06/24/cookies/" class="article-date">
  <time datetime="2019-06-24T06:40:18.000Z" itemprop="datePublished">2019-06-24</time>
</a>
    
  </div>
  <div class="article-inner">
    
    
      <header class="article-header">
        
  
    <h1 class="article-title" itemprop="name">
      cookies
    </h1>
  

      </header>
    
    <div class="article-entry" itemprop="articleBody">
      
        <p>:smile:</p>
<h3 id="发版"><a href="#发版" class="headerlink" title="发版"></a>发版</h3><ol>
<li>发布阶段：更新chagelog ,打 git tag 。</li>
</ol>
<h3 id="word"><a href="#word" class="headerlink" title="word"></a>word</h3><ol>
<li>deflate 放气，紧缩</li>
<li>Sanitize 消毒，净化</li>
<li><h3 id="js"><a href="#js" class="headerlink" title="js"></a>js</h3></li>
<li><p>随机字符串 Math.random().toString(36).substr(2));</p>
</li>
<li><p>Babel pollyfy 的作用 ：<a href="https://zhuanlan.zhihu.com/p/29058936" target="_blank" rel="noopener">https://zhuanlan.zhihu.com/p/29058936</a></p>
</li>
<li><p>Babel stag2 的功能  <a href="https://github.com/babel/babel/tree/master/packages/babel-preset-stage-2" target="_blank" rel="noopener">https://github.com/babel/babel/tree/master/packages/babel-preset-stage-2</a></p>
</li>
<li>所有的babel 包  <a href="https://github.com/babel/babel/tree/master/packages" target="_blank" rel="noopener">https://github.com/babel/babel/tree/master/packages</a></li>
<li>npx babel-upgrade</li>
<li>ES2019 中为Symbol对象添加了只读属性 description ，该对象返回包含Symbol描述的字符串。</li>
<li>变量的临时死区  </li>
<li>SET 操作的时间复杂度</li>
<li>如果你传的 context 就 null 或者 undefined，那么 window 对象就是默认的 context（严格模式下默认 context 是 undefined）</li>
<li>高阶函数的定义</li>
<li>作用域以及作用域链  函数作用域 —闭包</li>
<li>ES6 模块功能是它的导入模块是导出时模块的实时只读视图。（相比起 CommonJS，导入的是导出模块的拷贝副本，因此也不是实时的）。只读视图和内存拷贝的区别。</li>
<li>atob() 对经过 base-64 编码的字符串进行解码,btoa() base64加吗</li>
<li>Console.dir  显示对象所有的属性和方法</li>
<li>Broadcast Channel API 允许同一原始域和用户代理下的所有窗口,iFrames 等进行交互。也就是说，如果用户打开了同一个网站的的两个标签窗口，如果网站内容发生了变化，那么两个窗口会同时得到更新通知。</li>
<li>escape 在处理 0xff 之外字符的时候，是直接使用字符的 unicode 在前面加上一个 「%u」，而encodeURI则是先进行 UTF-8，再在 UTF-8 的每个字节码前加上一个 「%」； 所以通过encodeUrI 可以获取utf-8 字节长度</li>
<li>js value</li>
<li>Prototype 包含constructor 和 <strong>proto</strong>. 原型链存储共有的属性和方法，减少内存</li>
<li><p>基本的数据类型 </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">基本的数据类型</span><br><span class="line">undefined</span><br><span class="line">null</span><br><span class="line">string</span><br><span class="line">boolean</span><br><span class="line">number</span><br><span class="line">symbol(ES6)</span><br></pre></td></tr></table></figure>
</li>
<li><p>navigator.userAgent: 返回当前浏览器的user agent字符串</p>
</li>
<li>懒加载：<br>Javascript 脚步通常要等到 DOM 加载完后才会执行，如果加载的资源过多，可能会影响网页的正常使用。<br>能够节省流量和减轻服务器压力，更近一步就是能够为公司省成本。</li>
<li>String 和 new String 区别</li>
<li></li>
</ol>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br></pre></td><td class="code"><pre><span class="line">对象转原始类型，会调用内置的[ToPrimitive]函数，对于该函数而言，其逻辑如下：</span><br><span class="line"></span><br><span class="line">如果Symbol.toPrimitive()方法，优先调用再返回</span><br><span class="line">调用valueOf()，如果转换为原始类型，则返回</span><br><span class="line">调用toString()，如果转换为原始类型，则返回</span><br><span class="line">如果都没有返回原始类型，会报错</span><br><span class="line">var a = &#123;</span><br><span class="line">  value: 0,</span><br><span class="line">  valueOf: function() &#123;</span><br><span class="line">    this.value++;</span><br><span class="line">    return this.value;</span><br><span class="line">  &#125;</span><br><span class="line">&#125;;</span><br><span class="line">console.log(a == 1 &amp;&amp; a == 2);//true</span><br></pre></td></tr></table></figure>
<ol>
<li>Same origin 可以使用broadcast channel 两页面间通信。</li>
<li>注意闭包内this的指向</li>
<li></li>
</ol>
<h4 id="编译"><a href="#编译" class="headerlink" title="编译"></a>编译</h4><ol>
<li>无论你使用的是解释型语言(JavaScript、Python、Ruby)还是编译型语言(c#、Java、Rust)，都有一个共同的部分:将源代码作为纯文本解析为 抽象语法树(abstract syntax tree, AST) 的数据结构。</li>
<li>AST 不仅以结构化的方式显示源代码，而且在语义分析中扮演着重要角色。在语义分析中，编译器验证程序和语言元素的语法使用是否正确。之后，使用 AST 来生成实际的字节码或者机器码。</li>
<li><p>转义的过程：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">编写ES6代码</span><br><span class="line">babylon 进行解析</span><br><span class="line">解析得到 AST</span><br><span class="line">plugin 用 babel-traverse 对 AST 树进行遍历转译</span><br><span class="line">得到新的 AST树</span><br><span class="line">用 babel-generator 通过 AST 树生成 ES5 代码</span><br></pre></td></tr></table></figure>
</li>
<li><p>要应用更新，Virtual DOM核心功能将发挥作用，即 协调算法，它的工作是提供最优的解决方案来解决以前和当前虚拟DOM 状态之间的差异。</p>
</li>
</ol>
<h2 id="opentracing"><a href="#opentracing" class="headerlink" title="opentracing"></a>opentracing</h2><ol>
<li>Opentracing 的carrier 有多种实现，tracer 的inject（客户端进程） 和 extract（服务端进程），这样 客户端和服务端 就可以拥有相同的trace context。</li>
<li>Server 首先extract check 有没有注入的span，没有的话启动一个新的span</li>
</ol>
<h2 id="mac"><a href="#mac" class="headerlink" title="mac"></a>mac</h2><ol>
<li>Mac 设置path  export PATH=$PATH:</li>
<li>查看端口占用：lsof -i:3001</li>
<li>export http_proxy=”<a href="http://localhost:8899&quot;" target="_blank" rel="noopener">http://localhost:8899&quot;</a></li>
<li>Grep -A 5 显示后面5行信息</li>
</ol>
<h2 id="npm"><a href="#npm" class="headerlink" title="npm"></a>npm</h2><ol>
<li>npm config edit</li>
<li>npm config set init.author.name “ryansecreat”</li>
<li>npm config set <a href="mailto:init.email=&#39;chenjingnan@jd.com" target="_blank" rel="noopener">init.email=&#39;chenjingnan@jd.com</a>’</li>
<li>npm config set init.license “MIT”</li>
<li>npm start –prefix path/to/your/folder   //指定目录下运行</li>
<li>npm repo   浏览器中打开repo</li>
<li>npm publish –registry=<a href="http://registry.npmjs.org" target="_blank" rel="noopener">http://registry.npmjs.org</a>  –registry=<a href="https://registry.npm.taobao.org" target="_blank" rel="noopener">https://registry.npm.taobao.org</a></li>
<li>npm outdated  查看过时package</li>
<li>npm publish –tag=beta.</li>
<li>npm version patch -m “Upgrade to %s for reasons”</li>
<li>npm dist-tag add <a href="mailto:n-n-n-n@1.0.2-1" target="_blank" rel="noopener">n-n-n-n@1.0.2-1</a> latest  将某个预发版本更新为最新   </li>
<li>npm ping [–registry <registry>]</registry></li>
</ol>
<h3 id="node"><a href="#node" class="headerlink" title="node"></a>node</h3><ol>
<li>Stream cork uncork</li>
<li>escape-html  This function will escape the following characters: “, ‘, &amp;, &lt;, and &gt;.</li>
<li>domain模块，把处理多个不同的IO的操作作为一个组。注册事件和回调到domain，当发生一个错误事件或抛出一个错误时，domain对象会被通知，不会丢失上下文环境，也不导致程序错误立即退出，与process.on(‘uncaughtException’)不同。</li>
<li><p>stream tranform</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br></pre></td><td class="code"><pre><span class="line">const &#123; Transform &#125; = require(&apos;stream&apos;);</span><br><span class="line"></span><br><span class="line">const myTransform = new Transform(&#123;</span><br><span class="line">  transform(chunk, encoding, callback) &#123;</span><br><span class="line">    // ...</span><br><span class="line">  &#125;</span><br><span class="line">&#125;);</span><br></pre></td></tr></table></figure>
</li>
<li><p>可以引入corejs实现feature</p>
</li>
<li><p>性能分析<br>Node 性能分析，抓取火焰图 node –inspect app.js<br>Node  –prof-process  <a href="https://github.com/nswbmw/node-in-debugging/blob/master/1.3%20Tick%20Processor.md" target="_blank" rel="noopener">https://github.com/nswbmw/node-in-debugging/blob/master/1.3%20Tick%20Processor.md</a></p>
</li>
<li><p>一个promise类 </p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="class"><span class="keyword">class</span> <span class="title">Sleep</span> </span>&#123;</span><br><span class="line">then(resolve, reject)&#123;</span><br><span class="line"></span><br><span class="line">&#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
</li>
<li><p>Node 内置了pipeline  const { pipeline } = require(‘stream’);</p>
</li>
<li>Elastic APM 是 Elastic 公司开源的一款 APM 工具</li>
<li>Error.prepareStackTrace:定制化堆栈信息    Error.captureStackTrace:隐藏内部的实现细节，优化错误栈。</li>
<li>const { EventEmitter } = require(‘events’);  EventEmitter 的继承</li>
<li>Require.resovle() 获取模块的绝对路径  </li>
<li>peerDependencies 相关模块安装</li>
<li>websocket </li>
<li>cors 新浏览器<br>SameSite=Strict: The cookie is only sent if you are currently on the site that the cookie is set for. If you are on a different site and you click a link to a site that the cookie is set for, the cookie is not sent with the first request.</li>
<li></li>
<li></li>
</ol>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">WebSocket 使用了自定义的二进制分帧格式，把每个应用消息切分成一或多个帧，发送到目的地之后再组装起来，等到接收到完整的消息后再通知接收端。基本的成帧协议定义了帧类型有操作码、有效载荷的长度，指定位置的Extension data和Application data，统称为Payload data，保留了一些特殊位和操作码供后期扩展。在打开握手完成后，终端发送一个关闭帧之前的任何时间里，数据帧可能由客户端或服务器的任何一方发送。</span><br><span class="line"></span><br><span class="line">• 帧：最小的通信单位，包含可变长度的帧首部和净荷部分，净荷可能包含完整或部分应用消息。</span><br><span class="line">• 消息：一系列帧，与应用消息对等。</span><br></pre></td></tr></table></figure>
<ol>
<li>jwt 签名算法<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">HS256 使用密钥生成固定的签名，RS256 使用成非对称进行签名。简单地说，HS256 必须与任何想要验证 JWT的 客户端或 API 共享秘密。</span><br><span class="line">RS256 生成非对称签名，这意味着必须使用私钥来签签名 JWT，并且必须使用对应的公钥来验证签名。与对称算法不同，使用 RS256 可以保证服务端是 JWT 的签名者，因为服务端是唯一拥有私钥的一方。这样做将不再需要在许多应用程序之间共享私钥</span><br><span class="line"></span><br><span class="line">这种方法可以让我们分离开签发与验证，签发时需要用一个密钥，验证时使用公钥，也就是有公钥的地方只能做验证，但不能签发 JWT。</span><br></pre></td></tr></table></figure>
</li>
</ol>
<h3 id="egg"><a href="#egg" class="headerlink" title="egg"></a>egg</h3><ol>
<li>启动顺序<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line">Master 启动后先 fork Agent 进程</span><br><span class="line">Agent 初始化成功后，通过 IPC 通道通知 Master</span><br><span class="line">Master 再 fork 多个 App Worker</span><br><span class="line">App Worker 初始化成功，通知 Master</span><br><span class="line">所有的进程初始化成功后，Master 通知 Agent 和 Worker 应用启动成功</span><br></pre></td></tr></table></figure>
</li>
</ol>
<h3 id="网络"><a href="#网络" class="headerlink" title="网络"></a>网络</h3><ol>
<li><p>子网是所属VPC IP地址范围内的 IP 地址块。目前私有网络中的云资源部署在子网内，如云主机、容器、负载均衡等。子网：子网是对VPC地址空间的再一次划分，用户可以在子网中创建云主机。</p>
</li>
<li><p>可用区（Availability Zone）是电力及网络之间互相独立的物理区域，相同可用区内的实例之间较之同地域不同可用区内实例之间的网络延时更小。同地域内不同可用区之间提供内网互通环境，可用区之间可做到故障隔离。<br>若您的业务要求有较低网络时延，建议将实例或者Pod部署在同一可用区内。</p>
</li>
<li>VPC：VPC是用户网络在京东云上的表现形式，包含了一系列的网络功能，与其他的VPC逻辑隔离。VPC有一个网络地址空间，用户可以在其中继续划分子网。</li>
<li><p>NAT 地址网络转换，通过在路由器上安装 NAT 软件，它至少有一个有效的公网 IP 地址，通过 NAT 路由器将内部私有 IP 转换成公网 IP。它的问题在于 NAT 设备自动屏蔽了非内网主机主动发起的连接，也就是说，从外网发往内网的数据包将被 NAT 设备丢弃，这使得位于不同 NAT 设备之后的主机之间无法直接交换信息.</p>
</li>
<li><p>503 服务器资源不足问题导致的拒绝服务，比如熔断。</p>
</li>
<li><p>Options  </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">1. 检测服务支持的method</span><br><span class="line">2. Cors 预检</span><br></pre></td></tr></table></figure>
</li>
<li><p>HTTP HEAD 方法 请求资源的头部信息, 并且这些头部与 HTTP GET 方法请求时返回的一致. 该请求方法的一个使用场景是在下载一个大文件前先获取其大小再决定是否要下载, 以此可以节约带宽资源.</p>
</li>
<li>WebSocket是基于Http协议的，或者说借用了Http协议来完成一部分握手，在握手阶段与Http是相同的。我们来看一个websocket握手协议的实现，基本是2个属性，upgrade，connection。<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">Upgrade:webSocket</span><br><span class="line">Connection:Upgrade</span><br></pre></td></tr></table></figure>
</li>
</ol>
<h3 id="html"><a href="#html" class="headerlink" title="html"></a>html</h3><ol>
<li>Web quality  : alt</li>
<li><p>该WindowEventHandlers.onstorage属性包含一个在storage事件触发时运行的事件处理程序。当更改存储区域时会发生这种情况（例如，存储新项目）。</p>
<figure class="highlight javascript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="built_in">window</span>.onstorage = <span class="function"><span class="keyword">function</span>(<span class="params">e</span>) </span>&#123; <span class="built_in">console</span>.log(<span class="string">'The '</span> + e.key + <span class="string">' key has been changed from '</span> + e.oldValue + <span class="string">' to '</span> + e.newValue + <span class="string">'.'</span>); &#125;;</span><br></pre></td></tr></table></figure>
</li>
<li><p>navigator.sendBeacon() 方法可用于通过HTTP将少量数据异步传输到Web服务器。</p>
</li>
</ol>
<h3 id="vim"><a href="#vim" class="headerlink" title="vim"></a>vim</h3><p>j: 下移一行；</p>
<p>k: 上移一行；</p>
<p>w: 前移一个单词，光标停在下一个单词开头；</p>
<p>e: 前移一个单词，光标停在下一个单词末尾；</p>
<p>0: 移动到行首。</p>
<p>$: 移动到行尾。</p>
<p>n|: 把光标移到递n列上</p>
<p>zz: 将当前行移动到屏幕中央。</p>
<p>o: 在下面新建一行插入；</p>
<p>O: 在上面新建一行插入；</p>
<p>a: 在光标后插入；</p>
<p>A: 在当前行最后插入；</p>
<p>u: 取消一(n)个改动。</p>
<p>ctrl + r: 重做最后的改动。</p>

      
    </div>
    <footer class="article-footer">
      <a data-url="http://yoursite.com/2019/06/24/cookies/" data-id="ck3ya0yhk00030d8s6dj4mb2r" class="article-share-link">Share</a>
      
      
  <ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/零碎/">零碎</a></li></ul>

    </footer>
  </div>
  
    
<nav id="article-nav">
  
    <a href="/2019/06/28/es6/" id="article-nav-newer" class="article-nav-link-wrap">
      <strong class="article-nav-caption">Newer</strong>
      <div class="article-nav-title">
        
          es6
        
      </div>
    </a>
  
  
    <a href="/2019/06/24/regex/" id="article-nav-older" class="article-nav-link-wrap">
      <strong class="article-nav-caption">Older</strong>
      <div class="article-nav-title">regex</div>
    </a>
  
</nav>

  
</article>

</section>
        
          <aside id="sidebar">
  
    

  
    
  <div class="widget-wrap">
    <h3 class="widget-title">Tags</h3>
    <div class="widget">
      <ul class="tag-list"><li class="tag-list-item"><a class="tag-list-link" href="/tags/css/">css</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/docker/">docker</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/es/">es</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/eslint/">eslint</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/git/">git</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/hexo/">hexo</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/http/">http</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/https/">https</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/interview/">interview</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/loadtest/">loadtest</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/ops/">ops</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/pattern/">pattern</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/pm2/">pm2</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/postgre/">postgre</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/regex/">regex</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/ts/">ts</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/useful-package/">useful package</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/vue-eventloop-js/">vue eventloop js</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/web-安全/">web 安全</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/webpack/">webpack</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/安全/">安全</a></li><li class="tag-list-item"><a class="tag-list-link" href="/tags/零碎/">零碎</a></li></ul>
    </div>
  </div>


  
    
  <div class="widget-wrap">
    <h3 class="widget-title">Tag Cloud</h3>
    <div class="widget tagcloud">
      <a href="/tags/css/" style="font-size: 10px;">css</a> <a href="/tags/docker/" style="font-size: 10px;">docker</a> <a href="/tags/es/" style="font-size: 20px;">es</a> <a href="/tags/eslint/" style="font-size: 10px;">eslint</a> <a href="/tags/git/" style="font-size: 10px;">git</a> <a href="/tags/hexo/" style="font-size: 10px;">hexo</a> <a href="/tags/http/" style="font-size: 10px;">http</a> <a href="/tags/https/" style="font-size: 10px;">https</a> <a href="/tags/interview/" style="font-size: 10px;">interview</a> <a href="/tags/loadtest/" style="font-size: 10px;">loadtest</a> <a href="/tags/ops/" style="font-size: 10px;">ops</a> <a href="/tags/pattern/" style="font-size: 10px;">pattern</a> <a href="/tags/pm2/" style="font-size: 10px;">pm2</a> <a href="/tags/postgre/" style="font-size: 10px;">postgre</a> <a href="/tags/regex/" style="font-size: 10px;">regex</a> <a href="/tags/ts/" style="font-size: 10px;">ts</a> <a href="/tags/useful-package/" style="font-size: 10px;">useful package</a> <a href="/tags/vue-eventloop-js/" style="font-size: 10px;">vue eventloop js</a> <a href="/tags/web-安全/" style="font-size: 10px;">web 安全</a> <a href="/tags/webpack/" style="font-size: 10px;">webpack</a> <a href="/tags/安全/" style="font-size: 10px;">安全</a> <a href="/tags/零碎/" style="font-size: 10px;">零碎</a>
    </div>
  </div>

  
    
  <div class="widget-wrap">
    <h3 class="widget-title">Archives</h3>
    <div class="widget">
      <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/12/">December 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/11/">November 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/08/">August 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/07/">July 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/06/">June 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/05/">May 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/04/">April 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2019/02/">February 2019</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/02/">February 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/01/">January 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2016/12/">December 2016</a></li></ul>
    </div>
  </div>


  
    
  <div class="widget-wrap">
    <h3 class="widget-title">Recent Posts</h3>
    <div class="widget">
      <ul>
        
          <li>
            <a href="/2019/12/09/security-1/">security</a>
          </li>
        
          <li>
            <a href="/2019/11/08/encoding/">encoding</a>
          </li>
        
          <li>
            <a href="/2019/08/23/graphql/">graphql</a>
          </li>
        
          <li>
            <a href="/2019/07/02/linux/">linux</a>
          </li>
        
          <li>
            <a href="/2019/07/02/es8/">es8</a>
          </li>
        
      </ul>
    </div>
  </div>

  
</aside>
        
      </div>
      <footer id="footer">
  
  <div class="outer">
    <div id="footer-info" class="inner">
      &copy; 2019 ryansecreat<br>
      Powered by <a href="http://hexo.io/" target="_blank">Hexo</a>
    </div>
  </div>
</footer>
    </div>
    <nav id="mobile-nav">
  
    <a href="/" class="mobile-nav-link">Home</a>
  
    <a href="/archives" class="mobile-nav-link">Archives</a>
  
</nav>
    

<script src="//cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>


  <link rel="stylesheet" href="/fancybox/jquery.fancybox.css">
  <script src="/fancybox/jquery.fancybox.pack.js"></script>


<script src="/js/script.js"></script>

  </div>
</body>
</html>